{% extends "template_base.html" %}
{% block title %}DeepyWeb - Submit your query!{% endblock %}

{% block script %}
    <script>
        function finish_check() {
            /* todo */
        }

        $(function () {
            var text = document.getElementById("my_alert").textContent;
            if (text != '') {
                alert(text);
            }

            var type = document.getElementById("my_task_type").textContent;
            $('#pre_page').attr("href", "/new_task/"+type);
        });
    </script>
{% endblock %}

{% block navbar %}
    <nav id="navbar" class="navbar">
        <ul>
            <!--<li><a class="nav-link scrollto active " href="#header">Home</a></li>-->
            <li><a class="nav-link scrollto" href="/welcome">主 页</a></li>
            {% if not logged %}
                <li><a class="getstarted scrollto" href="login">登 录</a></li>
            {% endif %}
            {% if logged %}
                <li><a class="getstarted scrollto" href="logout">登 出</a></li>
            {% endif %}

        </ul>
        <i class="bi bi-list mobile-nav-toggle"></i>
    </nav><!-- .navbar -->
{% endblock %}

{% block main %}
    <main id="main">
        <span id="my_task_type" style="display: none">{{taskType}}</span>
        <span id="my_alert" style="display:none;">{{my_alert}}</span>
        <!-- ======= Breadcrumbs ======= -->
        <section class="breadcrumbs">
            <div class="container">
                <ol>
                    <li><a id="pre_page" href="">New Task</a></li>
                </ol>
                <h2>CHOOSE YOUR QUERY</h2>
            </div>
        </section>
        <!-- End Breadcrumbs -->

        <section class="inner-page">
            <div class="container">

                <!-- Outer Row -->
                <center>
                    <div class="col-xl-6 col-lg-6 col-md-9">
                        <div class="card o-hidden border-0 shadow-lg my-5">
                            <div class="card-body p-0">
                                <!-- Nested Row within Card Body -->
                                <div class="row">

                                    <div class="col-lg-12">

                                        <div class="p-5">
                                            <div class="text-center">
                                                <center><h2 style="font-size:2rem">提 交 您 的 参 数 需 求</h2></center>
                                            </div>
                                            <br>
                                            <form class="user" name="modelset" action="" enctype="multipart/form-data"
                                                  method="post">
                                                <!--输入x_labels，让用户用“,"分割，我们应该只需要split就可以了-->
                                                <div class="form-group">
                                                    <h3>
                                                        <div class="tips">选择 X_labels</div>
                                                    </h3>

                                                    <div class="">
<!--                                                        square-check-->


                                                            {% for column in columns %}
                                                            <input type="checkbox" name="X_labels" value="{{ column }}">
                                                            &nbsp{{ column }}
                                                            {% endfor %}


                                                </div>
                                                <br>
                                                <!--输入y_label-->
                                                <div class="form-group">
                                                    <h3>
                                                        <div class="tips">选择 y_label</div>
                                                    </h3>

                                                    <div class="circle-check">
                                                        {% for column in columns %}
                                                            <input type="radio" name="y_label"
                                                                   value="{{ column }}"> {{ column }}
                                                        {% endfor %}
                                                    </div>

                                                </div>
                                                <br>


                                                <!--输入stratify_label，如果需要，这里可以改成选择题-->
                                                <div class="form-group">
                                                    <h3>
                                                        <div class="tips">选择 stratify_label</div>
                                                    </h3>

                                                    <div class="circle-check">
                                                        {% for column in columns %}
                                                            <input type="radio" name="stratify_label"
                                                                   value="{{ column }}"> {{ column }}
                                                        {% endfor %}
                                                    </div>
                                                </div>
                                                <br>
                                                <!--输入随机种子，如果没有直接输none-->
                                                <div class="form-group">
                                                    <input type="text" class="form-control form-control-user"
                                                           id="exampleInputRandseed"
                                                           placeholder="输入 Randseed (若没有限制, 请输入 none)..."
                                                           name="RANDSEED"
                                                           style="width:85%; height:40px;border-radius: 10px;border-color:gainsboro;
                                                    border-style: solid;mso-border-shadow: yes;outline: none;">
                                                </div>
                                                <br>
                                                <!--输入模型的分配比-->
                                                <div class="form-group">
                                                    <input type="text" class="form-control form-control-user"
                                                           id="exampleInputRatio"
                                                           placeholder="输入模型的测试集占比 (Ratio)..."
                                                           name="test_ratio"
                                                           style="width:85%; height:40px;border-radius: 10px;border-color:gainsboro;
                                                    border-style: solid;mso-border-shadow: yes;outline: none;">
                                                </div>
                                                <br>
                                                {% if taskType == "LinearRegression" %}
                                                    <!--输入是否需要标准化(true or false);如果需要，这里可以改成选择题-->
                                                    <div class="form-group">
                                                        <input type="text" class="form-control form-control-user"
                                                               id="exampleInputNomalize"
                                                               placeholder="选择是否对数据标准化 (True or False)..."
                                                               name="normalize"
                                                               style="width:85%; height:40px;border-radius: 10px;border-color:gainsboro;
                                                    border-style: solid;mso-border-shadow: yes;outline: none;">
                                                    </div>
                                                    <br>
                                                    <center><input type="submit"
                                                                   class="btn btn-primary btn-user btn-block"
                                                                   value="提 交"
                                                                   style="width:200px; height:40px;"></center>
                                                    <br>
                                                {% elif taskType == "RandomForest" %}
                                                    <!--输入随机森林树的个数-->
                                                    <div class="form-group">
                                                        <input type="text" class="form-control form-control-user"
                                                               id="exampleInputNEstimators"
                                                               placeholder="输入 n_estimators (随机森林树的个数)..."
                                                               name="n_estimators"
                                                               style="width:85%; height:40px;border-radius: 10px;border-color:gainsboro;
                                                border-style: solid;mso-border-shadow: yes;outline: none;">
                                                    </div>
                                                    <br>
                                                    <!--输入最大步数-->
                                                    <div class="form-group">
                                                        <input type="text" class="form-control form-control-user"
                                                               id="exampleInputMaxDepth"
                                                               placeholder="输入 max_depth (最大步数)..." name="max_depth"
                                                               style="width:85%; height:40px;border-radius: 10px;border-color:gainsboro;
                                                border-style: solid;mso-border-shadow: yes;outline: none;">
                                                    </div>
                                                    <br>
                                                    <!--输入节点要包含的最小训练样本-->
                                                    <div class="form-group">
                                                        <input type="text" class="form-control form-control-user"
                                                               id="exampleInputMinSamplesSplit"
                                                               placeholder="输入 min_samples_split (节点要包含的最小训练样本)..."
                                                               name="min_samples_split"
                                                               style="width:85%; height:40px;border-radius: 10px;border-color:gainsboro;
                                                border-style: solid;mso-border-shadow: yes;outline: none;">
                                                    </div>
                                                    <br>
                                                    <!--输入分支后子节点包含的最小训练样本-->
                                                    <div class="form-group">
                                                        <input type="text" class="form-control form-control-user"
                                                               id="exampleInputMinSamplesLeaf"
                                                               placeholder="输入 min_samples_leaf (分支后子节点包含的最小训练样本)..."
                                                               name="min_samples_leaf"
                                                               style="width:85%; height:40px;border-radius: 10px;border-color:gainsboro;
                                                border-style: solid;mso-border-shadow: yes;outline: none;">
                                                    </div>
                                                    <br>
                                                    <!--输入最大步数-->
                                                    <div class="form-group">
                                                        <input type="text" class="form-control form-control-user"
                                                               id="exampleInputMaxFeatures"
                                                               placeholder="输入 max_features (最大特征数)..."
                                                               name="max_features"
                                                               style="width:85%; height:40px;border-radius: 10px;border-color:gainsboro;
                                                border-style: solid;mso-border-shadow: yes;outline: none;">
                                                    </div>
                                                    <br>
                                                    <!--增加文件儿上传项-->
                                                    <br>
                                                    <center><input type="submit"
                                                                   class="btn btn-primary btn-user btn-block"
                                                                   value="提 交" style="width:200px; height:40px;">
                                                    </center>
                                                    <br>
                                                {% endif %}
                                            </form>
                                        </div>
                                    </div>
                                </div>
                            </div>
                        </div>
                    </div>
                </center>
            </div>
            </div>
        </section>
    </main>
    <!-- End #main -->
{% endblock %}